<div class="main">

    <script>
        //        $('.preview').click(function(){
        //            var summary = $('#editor-trigger').html();
        //            console.log(typeof summary)
        //
        //            $('.modal_preview').css({
        //                height:$(window).height(),
        //                width:$(window).width()}
        //            ).show();
        //            $('.modal_content').empty().append(summary);
        //            var arrImg = $('.modal_content').find('img');
        //            $.each(arrImg,function(key,val){
        //                if($(val).width()>250){
        //                    $(val).css({
        //                        maxWidth: '100%',
        //                        height: 'auto'
        //                    })
        //                }
        //
        //            })
        //        })
        //        $('.modal_close').click(function(){
        //            $('.modal_preview').hide();
        //        })
    </script>
    <link rel="stylesheet" href="code/css/common.css">
    <link rel="stylesheet" href="code/css/index.css">
    <style>
        .layui-layer-content{
            background-color: #393D49;
            color: #fff;
        }
        #wrapper{
            background-color: #F3F3F5;
        }
        .up_load{
            width: 100%;
            display: -webkit-box;
            padding-top: 20px;
        }
        .up_load li{
            -webkit-box-flex: 1;
        }
        .up_load li img{
            width: 100px;
        }
        .upfilebox {
            position: relative;
        }
        .upfilebox input {
            width: 100px;
            height: 45px;
            position: relative;
            z-index: 9;
            opacity: 0;
        }
        .upfilebox label {
            position: absolute;
            display: inline-block;
            color: #fff;
            width: 125px;
            height: 45px;
            line-height: 36px;
            text-align: center;
            top: 0px;
            left: 0px;
            font-size: 16px;
            border-radius: 3px;
        }
        .layui-layer-content img{
            width: 100%;
            height: auto;
        }
        .layui-layer-title{
            display: none;
        }
    </style>
    <div class="content_title">
        <span>商城管理>>{{msg}}</span>
        <!--<button class="common_btn preview">预览</button>-->
        <button class="common_btn cancel" ng-click="cancel()">返回</button>
    </div>

    <div class="content_main">
        <table class="table mall_add_table">
            <tr>
                <td>
                    <i class="redStar">*</i>
                    <h5>商品名称:</h5>
                </td>
                <td>
                    <input type="text" class="common_input" ng-model="data.name">
                </td>
            </tr>

            <tr>
                <td>
                    <h5>商品图片:</h5>
                </td>
                <td id="mall_col_icon">
                    <!--<i class="redStar">312*252</i>-->
                    <!--<input type="file" id="upload_mall_Icon" accept="image/jpeg,image/png,image/gif" class="input_upload">-->
                    <ul class="up_load">
                        <li>
                            <div class="upfilebox">
                                <input type="file"  id="upload_mall_Icon" accept="image/jpeg,image/png,image/gif"/>
                                <!--<label >上传图片</label>-->
                                <label class="btn btn-success " type="button"><i class="fa fa-upload"></i>&nbsp;&nbsp;<span class="bold">上传图片</span>
                                </label>
                            </div>
                        </li>
                        <li>
                            <img src="{{data.icon}}" alt="" ng-show="data.icon" ng-click="showPhotos(data.icon,'icon')">
                        </li>
                    </ul>
                    <P class="redStar">312*252</P>
                </td>
            </tr>

            <tr>
                <td><h5>描述:</h5></td>
                <td>
                    <textarea id="mall_summary" placeholder="500字以内"></textarea>
                </td>
            </tr>
            
            <tr>
                <td><h5>图文详情图片:</h5></td>
                <td id="mall_col_summaryIcon">
                    <!--<input type="file" id="upload_mall_summaryIcon" accept="image/jpeg,image/png,image/gif" class="input_upload">-->
                    <ul class="up_load">
                        <li>
                            <div class="upfilebox">
                                <input type="file"  id="upload_mall_summaryIcon" accept="image/jpeg,image/png,image/gif"/>
                                <!--<label >上传图片</label>-->
                                <label class="btn btn-success " type="button"><i class="fa fa-upload"></i>&nbsp;&nbsp;<span class="bold">上传图片</span>
                                </label>
                            </div>
                        </li>
                        <li>
                            <img src="{{data.summaryIcon}}" ng-show="data.summaryIcon" alt="" ng-click="showPhotos(data.summaryIcon,'summaryIcon')">
                        </li>
                    </ul>
                    <!--<P class="redStar">312*252</P>-->
                </td>
            </tr>

            <tr>
                <td>
                    <i class="redStar">*</i>
                    <h5>兑换时间:</h5>
                </td>
                <td>
                    <!--<input id="mall_start" type="datetime-local" step=1 class="dateLocal_input"> - -->
                    <!--<input id="mall_end" type="datetime-local"  step=1 class="dateLocal_input">-->
                    <input id="mall_start"  class="form-control layer-date" placeholder="开始时间"onclick="laydate({istime: true, format: 'YYYY-MM-DD hh:mm:ss'})">
                    -
                    <input id="mall_end"  class="form-control layer-date" placeholder="开始时间"onclick="laydate({istime: true, format: 'YYYY-MM-DD hh:mm:ss'})">
                </td>
            </tr>

            <tr>
                <td>
                    <i class="redStar">*</i>
                    <h5>消耗呆币:</h5>
                </td>
                <td>
                    <input type="number" class="id_input" ng-model="data.coin">
                </td>
            </tr>

            <tr>
                <td>
                    <i class="redStar">*</i>
                    <h5>所得呆币</h5>
                </td>
                <td>
                    <input type="number" class="id_input" ng-model="data.gainCoin">
                </td>
            </tr>

            <tr>
                <td>
                    <i class="redStar">*</i>
                    <h5>库存:</h5>
                </td>
                <td>
                    <input type="number" class="id_input" ng-model="data.count">
                </td>
            </tr>

            <tr>
                <td>
                    <i class="redStar">*</i>
                   <h5> 商品属性:</h5>
                </td>
                <td>
                    <input type="radio" value="0" name="mall_type" id="mall_add_type1" checked>
                    <label for="mall_add_type1" class="common_label">签到拿呆币</label>

                    <input type="radio" value="1" name="mall_type" id="mall_add_type2">
                    <label for="mall_add_type2" class="common_label">补签卡</label>

                    <input type="radio" value="2" name="mall_type" id="mall_add_type3">
                    <label for="mall_add_type3" class="common_label">虚拟(图包之类)</label>

                    <input type="radio" value="3" name="mall_type" id="mall_add_type4">
                    <label for="mall_add_type4" class="common_label">虚拟(会员之类)</label>

                    <input type="radio" value="4" name="mall_type" id="mall_add_type5">
                    <label for="mall_add_type5" class="common_label">实物</label>
                </td>
            </tr>

            <tr>
                <td><h5>限制条件:</h5></td>
                <td>
                    当月最大连续签到天数:<input type="text" class="id_input" ng-model="data.attend">&nbsp;&nbsp;&nbsp;
                    历史总签到天数:<input type="text" class="id_input" ng-model="data.attendCount">&nbsp;&nbsp;&nbsp;
                    兑换次数:<input type="text" class="id_input" ng-model="data.times">
                </td>
            </tr>

            <!--<tr>-->
            <!--<td>所得呆币:</td>-->
            <!--<td>-->
            <!--<input type="text" class="id_input">-->
            <!--</td>-->
            <!--</tr>-->

            <tr>
                <td><h5>排序值:</h5></td>
                <td>
                    <input type="number" class="id_input" ng-model="data.weight">
                    <i class="redStar">数值越大越靠前</i>
                </td>
            </tr>

            <tr>
                <td>
                    <i class="redStar">*</i>
                    <h5>是否显示:</h5>
                </td>
                <td>
                    <input type="radio" id="mall_type_has" value="0" name="mall_add_status" checked>
                    <label for="mall_type_has" class="common_label">显示</label>

                    <input type="radio" id="mall_type_none" value="1" name="mall_add_status">
                    <label for="mall_type_none" class="common_label">隐藏</label>
                </td>
            </tr>
        </table>

        <div class="preserveCancel">
            <button class="preserve_btn" ng-click="mallPost()">保存</button>
            <button class="cancel_btn" ng-click="mallCancel()">取消</button>
        </div>
    </div>

    <div class="modal_preview">
        <img class="modal_close" src="code/css/close.png" alt="">
        <div class="modal_content">

        </div>
    </div>
</div>